<template>
  <el-dialog 
    title="监测数据详情"
    :visible.sync="visible"
    width="1200px"
    top="50px" 
    @close="close"
    :close-on-press-escape="false"
    :close-on-click-modal="false"	>
      <main-table
        ref="table"
        :height="450"
        :pageTotal="pageTotal"
        :data="tableData"
        :columns="columns"
        :columnType="['index']"
        border>
        <template slot-scope="scope" slot="dataValue">
            <span :title="scope.row.dataValue">{{ scope.row.dataValuePre }}</span>
        </template>   
      </main-table>
  </el-dialog>
</template>
<script>
export default {
  data() {
    return {
      pageTotal: 0,
      visible: false,
      columns: [
        { label: '样品编码', prop: 'qrCode' },
        { label: '监测因子', prop: 'polluteName' },
        { label: '监测浓度', prop: 'dataValue' },
        { label: '水质类别', prop: 'waterLevelName' },
        { label: '上报时间', prop: 'dataTime' },
        { label: '备注', prop: 'dataFlag' }
      ],
      rowspan: ['sampleCode'],
      tableData: []
    };
  },
  methods: {
    close() {
      this.tableData = [];
      this.visible = false;
    },
    initDialog(row) {
      this.visible = true;

      const params = {
        url: `/api/ems/task/detail?taskCode=${row.taskCode}`,
        type: 'post',
        params: {

        }
      };
      this.$ajax(params).then(resp => {
        const { result, rows } = resp;
        if (result) {
          this.tableData = rows;
        }
      });
    }
  }
};
</script>